Ext.onReady(function() {

	Ext.QuickTips.init();

	var width_input = 180;
	 
	var ds_agente = new Ext.data.Store({
				proxy : new Ext.data.HttpProxy({
							url : '/cake/syscable/TcMovimientosDiarios/ext_agente'
						}),
				reader : new Ext.data.JsonReader({
							fields : ['id', 'descripcion'],
							root : 'agentes'
						})
				//autoLoad : true
			});
	ds_agente.load();

	var ds_documento = new Ext.data.Store({
				proxy : new Ext.data.HttpProxy({
							url : '/cake/syscable/TcMovimientosDiarios/ext_documento'
						}),
				reader : new Ext.data.JsonReader({
							fields : ['id', 'codigo_referencia'],
							root : 'documentos'
						})
				//autoLoad : true
			});
	ds_documento.load();

	var cb_agente = new Ext.form.ComboBox({
				store : ds_agente,
				name : 'mg_agente_id',
				fieldLabel : 'Agente',
				triggerAction : 'all',
				mode : 'remote',
				typeAhead : true,
				forceSelection : true,
				lazyRender : true,
				// hiddenName: 'ventanilla',
				valueField : 'id',
				displayField : 'descripcion',
				allowBlank : false,
				blankText : 'Este campo es requerido',
				width : width_input
			});

	var cb_documento = new Ext.form.ComboBox({
				store : ds_documento,
				name : 'mg_documento_id',
				fieldLabel : 'Documento',
				triggerAction : 'all',
				mode : 'remote',
				typeAhead : true,
				forceSelection : true,
				lazyRender : true,
				// hiddenName: 'ventanilla',
				valueField : 'id',
				displayField : 'descripcion',
				allowBlank : false,
				blankText : 'Este campo es requerido',
				width : width_input
			});

	var frm_forma = new Ext.FormPanel({
				frame : false,
				bodyStyle : 'padding: 5px 5px 0',
				plain : false,
				trackResetOnLoad : true,
				labelWidth : 120,
				labelAlign : 'right',
				defaultType : 'textfield',

				items : [{
							fieldLabel : 'Contrato',
							name : 'contrato',
							allowBlank : false,
							hidden : false,
							readOnly : true,
							width : width_input,
							allowBlank : false
						}, {
							xtype : 'numberfield',
							fieldLabel : 'Meses pagados',
							name : 'meses',
							allowBlank : false,
							hidden : false,
							readOnly : true,
							width : width_input,
							allowBlank : false

						}, {
							xtype : 'numberfield',
							fieldLabel : 'Valor a pagar',
							name : 'valor_pagado',
							allowBlank : false,
							hidden : false,
							readOnly : true,
							width : width_input,
							allowBlank : false
						}, {
							xtype : 'datefield',
							fieldLabel : 'Fecha de pago',
							name : 'fecha_referencia',
							allowBlank : false,
							hidden : false,
							readOnly : true,
							width : width_input,
							allowBlank : false
						}, cb_agente, cb_documento, {
							xtype : 'textarea',
							fieldLabel : 'Descripcion',
							name : 'descripcion',
							hidden : false,
							readOnly : true,
							width : width_input,
							allowBlank : false
						}],
				buttons : [{
					text : 'Enviar',
					handler : function() {
						frm_forma.getForm().submit({
							success : function(f, a) {
								Ext.Msg.alert('Info',
										'Se han guardado los datos');
							},
							failure : function(f, a) {
								Ext.Msg.alert('Warning',
										'Error al enviar datos');
							}
						});
					}
				}, {
					text : 'Cancelar',
					handler : function() {
						frm_forma.getForm().reset();
					}
				}]

			});

	var panel = new Ext.Panel({
				title : 'Movimientos Diarios',
				id : 'detcontrato',
				layout : 'border',
				width : 400,
				height : 350,
				split : true,
				frame : true,
				renderTo : 'cajaext',
				items : [/*
							 * { region : 'west', frame : true, border : true,
							 * items : [menu] },
							 */{
							region : 'center',
							width : 200,
							// layout : 'fit',
							frame : false,
							border : false,
							items : [frm_forma]
						}]

			});
}); // eo function
